import React, { useEffect, useState,useCallback} from "react";
import EnhancedTable from "../table/EnhancedTable"
import { Space,Divider } from "antd";
import { getGoodsListByCondition } from "../../api/goods/goods";
import {message} from 'antd';
import * as Download from "../../utils/download/download"
import { getToken } from "../../utils/token";
const GoodsManagement = () =>{
    const [columns,setColumns] = useState([
        {
            title: '角色名称',
            dataIndex: 'name',
            align: 'center',
            key: 'name',
            render: (text) => <a>{text}</a>,
          },
          {
            title: '简写',
            dataIndex: 'shortName',
            align: 'center',
            key: 'shortName',
          },
          {
            title: '描述',
            dataIndex: 'description',
            align: 'center',
            key: 'description',
          },
          {
            title: '创建时间',
            dataIndex: 'createTime',
            align: 'center',
            key: 'createTime',
          },
          {
            title: '当前用户',
            dataIndex: 'users',
            align: 'center',
            key: 'users',
            render: (users) =>(
                <Space size="middle">
                <p>{users}</p>
                <a>设置用户</a>
              </Space>
            )
          },
          {
            title: '展示数据类型',
            dataIndex: 'dataShowMode',
            key: 'dataShowMode',
          },
          {
            title: '操作',
            dataIndex: 'operate',
            key: 'operate',
            render: () =>(
                <Space size="middle">
                <a>修改</a>
                <a>删除</a>
              </Space>
            )
          }
    ])
    const [searchParams,setSearchParams] = useState(
      [
        {
            title: '角色名',
            name: 'roleName',
            type: 'input',
            placeholder: '角色名称',
            maxLength: 30,
        }
    ]
    )
    const [load,setLoad] = useState(false);
    const [tableData,setTableData] = useState([]);
    const fetchData = async(params) => {
        setLoad(true);
        let res = await getGoodsListByCondition(params);
        if(res.flag){
            setTableData([...res.data.result])
        }
    }
    const onTableSearch = (params) => {
      if (params.applyTime) {
          params.applyTimeStart = params.applyTime[0].format('YYYY-MM-DD 00:00:00');
          params.applyTimeEnd = params.applyTime[1].format('YYYY-MM-DD 23:59:59');
      }
      params.foundation = 'true';
      fetchData(params);
  };

  const handleExport = (data) => {
      if (!data.total) {
          message.warn('导出数据为空');
      } else if (data.total > 1000) {
          message.warn('数据量大于1000条，请筛选后再导出');
      } else {
          const params = {
              id: data.id,
              companyName: data.companyName,
              agentName: data.agentName,
              auditStatus: data.auditStatus || '',
              createTimeStart: data.applyTime ? data.applyTime[0].format('YYYY-MM-DD') : '',
              createTimeEnd: data.applyTime ? data.applyTime[1].format('YYYY-MM-DD') : '',
              total: data.total
          };
          const headers = {
            "OSS-Token": getToken("ossToken")
          }
          Download.downloadLargeFile('/ukeyorder/common/ukey/order/export', params,"POST",);
      }
  };
    return (
        <div>
            <div className="content-title">
            <Divider type="vertical" />
            商品管理
            </div>
            <EnhancedTable
             loading={load}
             dataSource={tableData}
             bordered={true}
             columns={columns}
             searchParams={searchParams}
             onSearch={onTableSearch}
             hasExport={true}
             handleExport={handleExport}
            />
        </div>
    )
}

export default GoodsManagement